//需求:
//1 blur时判断手机号、密码是否合法，且是否正确输入验证码,验证码为1000-9999之间的随机数
//判断条件:
//a 手机号为11位的阿拉伯数字字符串即可
//b 密码只能有英文大小写、数字、下划线构成，且长度需在6-18之间,密码同时包含英文大小写及数字为强密码，
//包含三者中的两者为中，只含一种为弱
//c 确认密码和密码须一致
//d 需勾选 同意 注册条款
//2 注册成功后往本地存储中写入用户名及密码
window.onload = function(){
	var phoneBox = document.querySelector('#phone');
	var pswdBox = document.querySelector('#pswd');
	var codeBox = document.querySelector('#checkcode');
	var confirmBox = document.querySelector('#confirmpswd');	
	var subBtn = document.querySelector('#submit')
	var agree = document.querySelector('#agree');
	var codeSpan = document.querySelector('.code');
	var code = rand(1000,9999);
	codeSpan.innerHTML = code;

	var validObj = {phone:false,pswd:false,confirmPswd:false,code:false}
	codeSpan.onclick = function(){
		code = rand(1000,9999);
		codeSpan.innerHTML = code;
	}
	phoneBox.onblur = function(){
		if(validPhone(this.value)){
			validObj.phone = true;
			this.nextElementSibling.innerHTML = '';
			this.nextElementSibling.className="success";
		}else{
			validObj.phone = false;
			this.nextElementSibling.className="error";
			this.nextElementSibling.innerHTML='手机号格式不对!';
		}
	}
	pswdBox.onblur = function(){
		if(validPswd(this.value)){
			validObj.pswd = true;
			this.nextElementSibling.innerHTML = '';
			this.nextElementSibling.className="success";
			showPswdLevel(this.value);
		}else{
			validObj.pswd = false;
			this.nextElementSibling.className="error";
			this.nextElementSibling.innerHTML='需为6-16位英文大小写字母/数字/_';
		}
	}
	codeBox.onblur = function(){
		if(this.value==code){
			this.nextElementSibling.nextElementSibling.innerHTML='';
			validObj.code = true;
			this.nextElementSibling.nextElementSibling.className="success";
		}else{
			validObj.code = false;
			this.nextElementSibling.nextElementSibling.className="error";
			this.nextElementSibling.nextElementSibling.innerHTML='验证码错误';
		}

	}
	confirmBox.onblur = function(){
		if(this.value==pswdBox.value){
			validObj.confirmPswd = true;
			this.nextElementSibling.innerHTML='';
			this.nextElementSibling.className="success";
		}else{
			validObj.confirmPswd = false;
			this.nextElementSibling.className="error";
			this.nextElementSibling.innerHTML='两次输入密码不一致';
		}
	}
	subBtn.onclick = function(e){
		if(!agree.checked){
			this.nextElementSibling.innerHTML='您需要同意注册协议!';
			this.nextElementSibling.className = 'error';
			return false;
		}else if(!validObj.phone||!validObj.pswd||!validObj.confirmPswd||!validObj.code){
			this.nextElementSibling.innerHTML='注册信息有误!';
			this.nextElementSibling.className = 'error';
			return false;
		}else{
			e.preventDefault();
			this.nextElementSibling.innerHTML='';
			this.nextElementSibling.className = 'success';
			saveAccount(phoneBox.value,pswdBox.value);
			localStorage.setItem('nowUser',phoneBox.value);
			location.href = 'index.html';
			return false;
		}
	}
}

function validPhone(num){
	return (num.length==11 && !isNaN(num));
}

function validPswd(pswd){
	var scope = "1234567890abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ_";
	if(pswd.length<6 || pswd.length >16){
		return false;
	}else{
		for(var i=0;i<pswd.length;i++){
			if(scope.indexOf(pswd[i])==-1){
				return false;
			}
		}
	}
	return true;
}

function showPswdLevel(msg){
	var lvl = 0;
    if (msg.match(/[0-9_]/)){
        lvl++;
    }
    if (msg.match(/[A-Z]/)) {
        lvl++;
    }
    if (msg.match(/[a-z]/)) {
        lvl++;
    }
	console.log(lvl);
    if(document.querySelector('.safe em.current')){
    	document.querySelector('.safe em.current').classList.remove('current');
    }
    document.querySelector('.safe em.l'+lvl).classList.add('current');

}


function saveAccount(phone,pswd){
	var accounts = getUsers();
	accounts.push({phone:phone,pswd:pswd});
	localStorage.setItem('validUsers',JSON.stringify(accounts));
}

//获取已存在的用户名及密码
function getUsers(){
	var usersStr = localStorage.getItem('validUsers');
	if(usersStr){
		return JSON.parse(usersStr);
	}else{
		return [];
	}
}

function rand(min,max){
	return min + parseInt(Math.random()*(max-min+1));
}
